<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>新经资讯后台管理</title>
	<link rel="stylesheet" type="text/css" href="../../static/admin/css/reset.css">
	<link rel="stylesheet" type="text/css" href="../../static/admin/css/main.css">
	<script type="text/javascript" src="../../static/admin/js/echarts.min.js"></script>
</head>
<body>
	<div class="breadcrub">
		当前位置：用户管理>用户统计
	</div>
	<div class="spannels">
		 <div class="spannel scolor01">
            <em>{{ data.total_count }}</em><span>人</span>
            <b>用户总数</b>
            </div>
            <div class="spannel scolor02">
                <em>{{ data.mon_count }}</em><span>人</span>
                <b>用户月新增数</b>
            </div>
            <div class="spannel2 scolor03">
                <em>{{ data.day_count }}</em><span>人</span>
                <b>用户日新增数</b>
            </div>
	</div>
	
	<div class="pannel">
		<div id="chart_show" class="chart_show"></div>
	</div>
	<script>
		var oChart = echarts.init(document.getElementById('chart_show'));
		var chartopt = {
					    title:{
					        text: '用户登录活跃数',
		                    left: 'center',
		                    top: '10'
					    },
					    tooltip:{
					        trigger: 'axis'
					    },
					    legend: {
					        data:['active'],
		                    top: '40'
					    },
					    toolbox: {
					        show : true,
					        feature : {
					            mark : {show: true},
					            dataView : {show: true, readOnly: false},
					            magicType : {show: true, type: ['line','bar']},
					            restore : {show: true},
					            saveAsImage : {show: true}
					        }
					    },
				    	calculable : true,               
					    xAxis : [
    {
        name: '今天',
        type : 'category',
        boundaryGap : false,
        data : {{ data.active_date | safe }}
    }
],
yAxis : [
    {
        name: '活跃用户数量',
        type : 'value'
    }
],
series : [
    {
        name:'active',
        type:'line',
        smooth:true,
        itemStyle: {normal: {areaStyle: {type: 'default'}, color: '#f80'}, lineStyle: {color: '#f80'}},
        data: {{ data.active_count }}
    }],
areaStyle:{
    normal:{
        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
            offset: 0,
            color: 'rgba(255,136,0,0.39)'
        }, {
            offset: .34,
            color: 'rgba(255,180,0,0.25)'
        },{
            offset: 1,
            color: 'rgba(255,222,0,0.00)'
        }])

    }
}

};

            oChart.setOption(chartopt);

	</script>
</body>
</html>